import PageList from "./PageList.js";
const template = (`
     <div class="commentOn">
         <div class="noContent" v-if="showList.length === 0">暂无留言</div>
         <div class="messList" v-else>
             <div class="reply" v-for="item in showList" :key="item.id">
                 <p class="replyContent">{{item.content}}</p>
                 <p class="operation">
                     <span class="replyTime">{{item.addTime}}</span>
                     <span class="handle">
                         <a href="javascript:;" @click="changeLike(item.id,'upNum')" class="top">{{item.upNum}}</a>
                         <a href="javascript:;" @click="changeLike(item.id,'downNum')" class="down_icon">{{item.downNum}}</a>
                         <a href="javascript:;" @click="deleteComments(item.id)" class="cut">删除</a>
                     </span>
                 </p>
             </div>
         </div>
         <page-list :page-num="pageNum" :change-page="changePage" :page-now="pageNow" ></page-list>
     </div>
`);
export default {
    template,
    props:['comment-list','page-size','delete-comments','change-like'],
    components :{
        PageList
    },
    data(){
        return {
            pageNow : 1,
        }
    },
    methods:{
        changePage(page){
            this.pageNow = page
        }
    },
    computed:{
        showList(){
            return this.commentList.slice((this.pageNow - 1) * this.pageSize, (this.pageNow - 1) * this.pageSize + this.pageSize)
        },
        pageNum(){
            return Math.ceil(this.commentList.length / this.pageSize);
        }
    },
}